import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/my_dekegate.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'grid_view_item.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>
    with SingleTickerProviderStateMixin {
  List<String> list = [
    'A',
    'B',
    'C',
    'D',
    'E',
    'F',
    'G',
    'H',
    'I',
    'J',
    'K',
    'L',
    'M',
    'N',
    'O',
    'P',
    'K',
    'R',
    'S',
    'P'
  ];
  List<dynamic> listIndexTopData = [
    {
      "title": "出勤紀錄",
      "imagePath": "images/parents.png",
      "path": "/index/attendanceRecord"
    },
    {"title": "膳食", "imagePath": "images/parents.png", "path": "/index/diet"},
    {
      "title": "成長紀錄",
      "imagePath": "images/parents.png",
      "path": "/index/growUp"
    },
    {
      "title": "訂單紀錄",
      "imagePath": "images/parents.png",
      "path": "/index/order"
    },
    {
      "title": "學生信息",
      "imagePath": "images/parents.png",
      "path": "/index/information"
    },
    {
      "title": "學生相冊",
      "imagePath": "images/parents.png",
      "path": "/index/studentAlbum"
    },
    {
      "title": "訂閱服務",
      "imagePath": "images/parents.png",
      "path": "/index/service"
    },
    {
      "title": "家長列表",
      "imagePath": "images/parents.png",
      "path": "/index/parents"
    },
  ];
  ScrollController _controller;

  var hidden = false;
  var offstage = false;

  @override
  void initState() {
    super.initState();
    _controller = ScrollController()
      ..addListener(() {
        setState(() {
          hidden = _controller.offset >= 30;
        });
      });
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

//  頂部导航栏
  Widget _indexTopNavigation() {
    // return GridView.builder(
    //     gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
    //         crossAxisCount: 4, childAspectRatio: 1),
    //     itemBuilder: (context, index) {
    //       if (index == 0) {
    //         return GridViewItem(
    //           title: listIndexTopData[index]['title'],
    //           imagePath: listIndexTopData[index]['imagePath'],
    //           onPressed: null,
    //         );
    //       }
    //     },
    //     itemCount: listIndexTopData.length,
    //     physics: const NeverScrollableScrollPhysics());
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: List.generate(
              4,
                  (index) => GridViewItem(
                title: listIndexTopData[index]['title'],
                imagePath: listIndexTopData[index]['imagePath'],
                onPressed: null,
              )),
        ),
        SizedBox(height: 30),
        Offstage(
          offstage: offstage,
          child: AnimatedOpacity(
            opacity: hidden ? 0 : 1,
            duration: Duration(milliseconds: 200),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: List.generate(
                  4,
                      (index) => GridViewItem(
                    title: listIndexTopData[index + 4]['title'],
                    imagePath: listIndexTopData[index + 4]['imagePath'],
                    onPressed: null,
                  )),
            ),
            onEnd: () {
              setState(() {
                offstage = hidden;
              });
            },
          ),
        )
      ],
    );
  }

  List<int> positions;
  int memoryPosition;
  @override
  Widget build(BuildContext context) {
    //填入设计稿中设备的屏幕尺寸

    //默认 width : 1080px , height:1920px , allowFontScaling:false
    ScreenUtil.instance = ScreenUtil.getInstance()..init(context);

    //假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
    ScreenUtil.instance = ScreenUtil(width: 375, height: 667)..init(context);

    //设置字体大小根据系统的“字体大小”辅助选项来进行缩放,默认为false
    ScreenUtil.instance =
    ScreenUtil(width: 375, height: 667, allowFontScaling: true)
      ..init(context);
    return Scaffold(
        appBar: AppBar(
          backgroundColor: Color(0Xff4d80c5),
          elevation: 0, //取消頂部陰影
          leading: IconButton(
            icon: Icon(Icons.pregnant_woman),
            onPressed: null,
          ), //個人中心
          actions: <Widget>[
            Container(
              height: 35,
              width: 35,
              decoration: BoxDecoration(
                  color: Colors.amberAccent,
                  borderRadius: BorderRadius.all(Radius.circular(35))),
            )
          ], //接送狀態
        ),
        body: Column(
          children: <Widget>[
            Container(
              decoration: BoxDecoration(
                gradient: LinearGradient(
                    begin: Alignment.center,
                    end: AlignmentDirectional.bottomCenter,
                    colors: [Color(0Xff4d80c5), Color(0Xffcedcee)]),
                borderRadius: BorderRadius.only(
                  bottomRight: Radius.circular(25),
                  bottomLeft: Radius.circular(25),
                ),
              ),
              child: AnimatedSize(
                duration: Duration(milliseconds: 200),
                vsync: this,
                child: Container(
                  margin: EdgeInsets.only(bottom: 5),
                  padding: EdgeInsets.only(bottom: 8),
                  decoration: BoxDecoration(
                      color: Color(0Xff4d80c5),
                      borderRadius: BorderRadius.only(
                          bottomLeft: Radius.circular(25),
                          bottomRight: Radius.circular(25))),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      //頂部個人中心狀態
                      Container(
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[],
                        ),
                      ),
                      //導航欄
                      Container(
                        margin: EdgeInsets.only(left: 15, right: 15),
                        width: MediaQuery.of(context).size.width,
                        // height: ScreenUtil().setHeight(136),
                        child: _indexTopNavigation(),
                      ),
                      GestureDetector(
                        onVerticalDragUpdate: (details) {
                          if (details.localPosition.direction > 0) {
                            setState(() {
                              hidden = false;
                            });
                          } else if (details.localPosition.direction < 0) {
                            setState(() {
                              hidden = true;
                            });
                          }
                        },
                        child: Container(
                          margin: EdgeInsets.only(top: ScreenUtil().setSp(8)),
                          width: ScreenUtil.getInstance().setWidth(160),
                          height: 5,
                          decoration: BoxDecoration(
                            border: Border(
                              bottom: BorderSide(
                                  color: Colors.white,
                                  width: 3,
                                  style: BorderStyle.solid),
                            ),
                          ),
                        ),
                      )
                    ],
                  ),
                ),
              ),
            ),
            Expanded(
              child: Container(
                //下拉刷新
                  child: new ListView.custom(
                    controller: _controller,
                    cacheExtent: 1.0, // 只有设置了1.0 才能够准确的标记position 位置
                    childrenDelegate:  MyChildrenDelegate(
                          (BuildContext context, int index) {
                        return new Dismissible(
                            key: new Key(list[index]),
                            onDismissed: (direction) {
                              //被移除回掉
                              list.removeAt(index);
                              var item = list[index];
                              Scaffold.of(context).showSnackBar(
                                  new SnackBar(content: new Text("$item")));
                            },
                            child: new ListTile(
                              title: new Text(list[index]),
                            ));
                      },
                      childCount: list.length,
                    ),
                  )),
            )
          ],
        ));
  }
}
